<template>
    <div class="panel">
        <div class="header">
            <el-input v-model="searchItem.searchName" placeholder="项目名称" style="width: 120px;"/>
            <el-select v-model="searchItem.searchType" style="width: 120px;">
                <el-option v-for="item in recordName" :label="item.name" :value="item.value" :key="item.value"></el-option>
            </el-select>
            <el-button type="primary" icon="el-icon-search" style="margin-left: 10px;" @click="getitemName">搜索科室</el-button>
            <el-button type="danger" icon="el-icon-download" @click="deleteIds">批量删除</el-button>
            <el-button type="primary" icon="el-icon-download" style="margin-left: 300px;" @click="getexportExcel" >导出excel</el-button>
            <el-upload
              class="upload-demo"
              :action="BASE_API+'/fmeditem/importExcel'"
              accept=".xlsx"
              :on-success = "successFlie"
              :on-error	= "errorFile"
              :file-list="fileList"
              style="display: inline-block; margin-left: 20px;"
              >
              <el-button type="primary" icon="el-icon-download">导入excel</el-button>      
          </el-upload>
            <a href="./file2.xlsx" download="file2.xlsx"><i class="el-icon-download"></i>点击下载模板</a>
        </div>
        <div class="health" style="margin-top: 20px;">
            <el-table ref="multipleTable" :data="fmeditemList" border tooltip-effect="dark" style="width: 100%;"  @selection-change="handleSelectionChange"
                :cell-style="rowStyle" :header-cell-style="rowStyle">
                <el-table-column type="selection" width="55">
                </el-table-column>
                <el-table-column prop="itemName" label="项目名称" width="120">
                </el-table-column>
                <el-table-column prop="itemCode" label="项目编码" width="120">
                </el-table-column>
                <el-table-column prop="format" label="规格单位" width="120">
                </el-table-column>
                <el-table-column prop="price" label="单价" width="120">
                </el-table-column>
                <el-table-column prop="expName" label="所属费用科目" width="120">
                </el-table-column>
                <el-table-column prop="deptName" label="科室名称" width="120">
                </el-table-column>
                <el-table-column prop="recordType" label="项目类型" width="120">
                    <template slot-scope="scope">
                        {{ recordName[scope.row.recordType - 1].name }}
                    </template>
                </el-table-column>
                <el-table-column prop="delMark" label="删除状态" width="120">
                    <template slot-scope="scope">
                        {{ scope.row.delMark == 1 ? "正常" : "已删除" }}
                    </template>
                </el-table-column>
                <el-table-column prop="id" label="操作" width="200">
                    <template slot-scope="scope">
                        <el-button type="success" size="small" @click="getUpdate(scope.row)">修改</el-button>
                        <el-button type="danger" size="small" @click="getdeleteFmeditem(scope.row.id)">删除</el-button>
                    </template>                   
                </el-table-column>
            </el-table>
        </div>
        <div>
            <el-dialog title="修改非药品收费项目" :visible.sync="dialogVisible" width="50%" :before-close="handleClose" top="30px">
                <el-form :model="fmeditem" :rules="rules" ref="fmeditem" label-width="100px" class="demo-ruleForm">
                    <el-form-item label="项目编码" prop="ItemCode">
                        <el-input v-model="fmeditem.ItemCode"></el-input>
                    </el-form-item>
                    <el-form-item label="项目名称" prop="ItemName">
                        <el-input v-model="fmeditem.ItemName"></el-input>
                    </el-form-item>
                    <el-form-item label="规格" prop="Format">
                        <el-input v-model="fmeditem.Format"></el-input>
                    </el-form-item>
                    <el-form-item label="单价" prop="Price">
                        <el-input v-model="fmeditem.Price"></el-input>
                    </el-form-item>
                    <el-form-item label="所属费用ID" prop="ExpClassID">
                        <el-input v-model="fmeditem.ExpClassID" type="number" style="width: 100px;"></el-input>
                    </el-form-item>
                    <el-form-item label="执行科室ID" prop="DeptID">
                        <el-input v-model="fmeditem.DeptID" type="number" style="width: 100px;"></el-input>
                    </el-form-item>
                    <el-form-item label="拼音助记码" prop="MnemonicCode">
                        <el-input v-model="fmeditem.MnemonicCode"></el-input>
                    </el-form-item>
                    <el-form-item label="项目类型" prop="RecordType">
                        <el-select v-model="fmeditem.RecordType" placeholder="请选择项目类型">
                            <el-option label="检查" value=1></el-option>
                            <el-option label="检验" value=2></el-option>
                            <el-option label="处置" value=3></el-option>
                        </el-select>
                    </el-form-item>
                </el-form>
                <span slot="footer" class="dialog-footer">
                    <el-button @click="dialogVisible = false">取 消</el-button>
                    <el-button type="primary" @click="getupdateFmeditem">确 定</el-button>
                </span>
            </el-dialog>
        </div>
        <div class="footer" style="margin-left: 313px;padding-top: 20px;">
            <el-pagination background :page-size="8" :current-page="pageIndex" @current-change="getpageFmeditem"
                layout="total,prev, pager, next,jumper" :total="total">
            </el-pagination>
        </div>
    </div>
</template>

<script>
import fmeditem from '@/api/his/fmeditem'
import global from '@/utils/global'
export default {
    data() {
        return {
            searchItem:{
                searchName:"",
                searchType:0
            },
            BASE_API: global.Base_Api, // 接口API地址
            ids: [],
            fileList:[],
            fmeditemList: [],
            total:null,
            pageIndex: 1,
            recordName: [{name:'无',value:0},{name:"检查",value:1}, {name:"检验",value:2}, {name:"处置",value:3}],
            fmeditem: {
                id:null,
                ItemCode: '',
                ItemName: '',
                Format: '',
                Price: '',
                ExpClassID: 1,
                DeptID: 1,
                MnemonicCode: '',
                RecordType:0,
            },
            rules: {
                ItemCode: [
                    { required: true, message: '请输入项目编码', trigger: 'blur' },
                    { min: 9, max: 9, message: '长度在 9个字符', trigger: 'blur' }
                ],
                ItemName: [
                    { required: true, message: '请输入项目名称', trigger: 'blur' },
                    { min: 1, max: 20, message: '长度在 1到20个字符', trigger: 'blur' }
                ],
                Format: [
                    { required: true, message: '请输入规格', trigger: 'blur' },
                    { min: 1, max: 5, message: '长度在 1到5个字符', trigger: 'blur' }
                ],
                Price: [
                    { required: true, message: '请输入单价', trigger: 'blur' },
                    { min: 3, max: 10, message: '长度在 3到10个字符', trigger: 'blur' }
                ],
                ExpClassID: [
                    { required: true, message: '请输入所属费用ID', trigger: 'blur' },
                    { min: 1, max: 5, message: '长度在 1到5个字符', trigger: 'blur' }
                ],
                DeptID: [
                    { required: true, message: '请输入执行科室ID', trigger: 'blur' },
                    { min: 1, max: 5, message: '长度在 1到5个字符', trigger: 'blur' }
                ],
                MnemonicCode: [
                    { required: true, message: '请输入所属拼音助记码', trigger: 'blur' },
                    { min: 3, max: 10, message: '长度在 3到10个字符', trigger: 'blur' }
                ],
            },
            multipleSelection: [],
            dialogVisible: false
        }
    },
    methods: {
        successFlie(res){
            console.log(res);
            if(res.success){
                this.$message.success("添加成功")
                this.getpageFmeditem()
            }else{
                this.$message.error("添加失败")
            }
        },
        errorFile(){
            this.$message.error("上传失败")
        },
        handleSelectionChange(val){
            this.multipleSelection=val
        },
        deleteIds(){
            this.multipleSelection.forEach(element => {
                this.ids.push(element.id)
            });
            this.getdelFmeditemByIds()
        },
        getUpdate(scope){
            console.log(scope)
            this.dialogVisible=true
            this.fmeditem.id=scope.id
            this.fmeditem.ItemCode = scope.itemCode
            this.fmeditem.ItemName = scope.itemName
            this.fmeditem.Format = scope.format
            this.fmeditem.Price = scope.price
            this.fmeditem.ExpClassID = scope.expClassID
            this.fmeditem.DeptID = scope.deptID
            this.fmeditem.MnemonicCode = scope.mnemonicCode
            this.fmeditem.RecordType = scope.recordType

        },
        rowStyle() {
            return "text-align:center"
        },
        pages(val){
           
        },
        handleClose(done) {
            this.$confirm('确认关闭？')
                .then(_ => {
                    done();
                })
                .catch(_ => { });
        },
        async getdeleteFmeditem(deleteid) { 
            const res = await fmeditem.getdeleteFmeditemAPI(deleteid)
            if(res.data.code == 20000){
                    this.$message.success("删除成功")
                    this.getpageFmeditem()
            }else{
                this.$message.error("删除失败")
            }
        },
        async getdelFmeditemByIds() {
            const res = await fmeditem.getdelFmeditemByIdsAPI(this.ids)
            if(res.data.success){
                this.$message.success('批量删除成功');
                this.getpageFmeditem()
            }else{
                this.$message.error('批量删除失败');
            }
        },
        async getupdateFmeditem() {
            const res = await fmeditem.getupdateFmeditemAPI(this.fmeditem)
            if(res.data.success){
                this.$message.success('修改成功');
                this.getpageFmeditem()
            }else{
                this.$message.error('修改失败');
            }
            this.dialogVisible=false
        },
        async getpageFmeditem(page=1) {
            this.pageIndex = page
            const res = await fmeditem.getpageFmeditemAPI(this.pageIndex,this.searchItem.searchName,this.searchItem.searchType)
            this.fmeditemList = res.data.data.list
            this.total=res.data.data.total
        },
        async getitemName(){
            const res = await fmeditem.getpageFmeditemAPI(this.pageIndex,this.searchItem.searchName,this.searchItem.searchType) 
            this.fmeditemList = res.data.data.list  
            this.total=res.data.data.total  
            this.getpageFmeditem()  
        },
        async getexportExcel(){
            await fmeditem.getexportExcelAPI().then(()=>{
                this.$message.success('导出到D盘成功')
            }).catch(()=>{
                this.$message.success('导出失败')
            })
        }
    },
    created() {
        this.getpageFmeditem()
    }
}
</script>

<style scoped></style>